<template>
  <t-tabs v-model="value" size="medium">
    <t-tab-panel :class="[reviewOpen?'tab-full-panel':'tab-panel']" value="1" label="标准化报审详情">
      <t-form  labelWidth="120px" :colon="true">
        <t-row style="align-items: stretch;">
          <t-col :span="12">
            <t-card class="step-card" size="small" title="基本信息">
              <t-row style="align-items: stretch;padding: 10px">
                <t-col :span="12">
                  <t-form-item label="任务来源" name="taskSource">
                    {{ data.taskSource }}
                  </t-form-item>
                  <t-form-item label="计划项目编号" name="projectNum">
                    {{ data.projectNum }}
                  </t-form-item>
                  <t-form-item label="起草单位名称" name="unitId">
                    {{ data.unitId | filterByTree(deptMenuOptions) }}
                  </t-form-item>
<!--                  <t-form-item label-align="top" label="起草小组成员"  name="unitId">-->
<!--                    <member-list v-model="data.draftPersons"-->
<!--                                 :editOpen="false" ></member-list>-->
<!--                  </t-form-item>-->
                </t-col>
              </t-row>
            </t-card>
          </t-col>
        </t-row>
        <t-row style="align-items: stretch;">
          <t-col :span="12">
            <t-card class="step-card" size="small" title="起草小组成员">
              <member-list v-model="data.draftPersons"
                           :editOpen="false" ></member-list>
            </t-card>
          </t-col>
        </t-row>
      </t-form>
    </t-tab-panel>
    <t-tab-panel :class="[reviewOpen?'tab-full-panel':'tab-panel']" value="2" label="主要技术指标">
      <t-form labelWidth="140px">
        <t-row style="align-items: stretch;padding: 10px">
          <t-col :span="12">
            <t-card class="step-card" size="small" title="主要技术指标">
<!--              <div v-html="data.technologyIndex" class="content_style"></div>-->
              <inner-html :content="data.technologyIndex"></inner-html>

            </t-card>
          </t-col>
        </t-row>
      </t-form>
    </t-tab-panel>
    <t-tab-panel :class="[reviewOpen?'tab-full-panel':'tab-panel']" value="3" label="经济效益或社会效益">
      <t-form labelWidth="140px">
        <t-row style="align-items: stretch;padding: 10px">
          <t-col :span="12">
            <t-card class="step-card" size="small" title="经济效益或社会效益">
<!--              <div v-html="data.expectedGoal" class="content_style"></div>-->
              <inner-html :content="data.expectedGoal"></inner-html>

            </t-card>
          </t-col>
        </t-row>
      </t-form>
    </t-tab-panel>
    <t-tab-panel :class="[reviewOpen?'tab-full-panel':'tab-panel']" value="4" label="贯穿标准的措施建议">
      <t-form labelWidth="140px">
        <t-row style="align-items: stretch;padding: 10px">
          <t-col :span="12">
            <t-card class="step-card" size="small" title="贯穿标准的措施建议">
<!--              <div v-html="data.suggestion" class="content_style"></div>-->
              <inner-html :content="data.suggestion"></inner-html>

            </t-card>
          </t-col>
        </t-row>
      </t-form>
    </t-tab-panel>
    <t-tab-panel :class="[reviewOpen?'tab-full-panel':'tab-panel']" value="5" label="附件">
      <t-form labelWidth="140px">
        <t-row style="align-items: stretch;padding: 10px">
          <t-col :span="12">
<!--            <t-card class="step-card" size="small" title="附件信息">-->
              <t-table row-key="id" :columns="projectFileColumns" :data="projectFileData">
                <template #id="{row, rowIndex}">
                  {{ rowIndex+1 }}
                </template>
                <template #op="{row}">
                  <div v-for="(item,index) in row.fileLists" :key="index">
                    <a class="t-button-link" target="_blank" :href="item.url" >
                      {{item.name}}
                    </a>
                  </div>
                </template>
              </t-table>
<!--            </t-card>-->
          </t-col>
        </t-row>
      </t-form>
    </t-tab-panel>
  </t-tabs>
</template>

<script>
import memberList from "../../../components/member-list.vue";
import {getFiles} from "@/api/common";
import InnerHtml from "@/components/InnerHtml/index.vue";


export default {
  name: "standard-bs-detail",
  components:{
    memberList,
    InnerHtml
  },
  props: {
    objId: [String,Number],
    reviewOpen: {
      type: Boolean,
      default: false
    },
  },
  data(){
    return {
      value:"1",
      deptMenuOptions: [],
      data: {
        draftUnits:[],
        draftPersons: []
      },
      projectFileColumns: [
        {
          colKey: "id",
          title: "序号",
          align: "center",
          width: 64
        },
        {
          colKey: "c1",
          title: "附件名称",
          align: "center",
        },
        {
          colKey: "c2",
          title: "是否必需",
          align: "center",
        },
        {
          colKey: "op",
          title: "附件列表",
          align: "left",
        },
      ],
      projectFileData: [
        {
          id: 1,
          c1: "报审表一式三份（盖好相应章）",
          c2: "是",
          moduleKey: "projectBSB",
          fileIds: [],
          fileLists: [],
        },
        {
          id: 2,
          c1: "报审标准文本",
          c2: "是",
          fileIds: [],
          fileLists: [],
          moduleKey: "projectBSBZWB"
        },
        {
          id: 3,
          c1: "报审编制说明",
          c2: "是",
          fileIds: [],
          fileLists: [],
          moduleKey: "projectBZSM"
        },
        {
          id: 4,
          c1: "报审征求意见汇总表",
          c2: "是",
          fileIds: [],
          fileLists: [],
          moduleKey: "projectBSZQYJ"
        },
      ],
    }
  },
  created() {
    this.getObj();
    this.getDeptTreeSelect();
  },
  methods:{
    getObj(){
      getFiles(this.objId).then((res) => {
        const files = {}
        res.data.forEach((item) => {
          if (!files[item.moduleKey]) {
            files[item.moduleKey] = []
          }
          files[item.moduleKey].push({
            name: item.fileName,
            url: item.fullFilePath,
            id: item.id,
            filePath: item.filePath
          })
        })
        this.projectFileData.forEach((val,index)=>{
          this.projectFileData[index].fileLists = files[val.moduleKey] || [];
          this.projectFileData[index].fileIds = files[val.moduleKey]?.map(val => val.id) || [];
        })
      }).catch((e) => {
        this.$message.error(e.toString());
      });
      this.$api.bzh.report.getByLocalId(this.objId).then(response => {
        this.data = response.data
      })
    },
    getDeptTreeSelect(){
      return this.$api.system.dept.treeSelectAllIn().then(response=>{
        this.deptMenuOptions = response.data
      }).catch(e=>{
        this.$message.error(e.toString())
      })
    },
  }
}
</script>

<style lang="less" scoped>
.t-tab-panel{
  padding: 10px;
}
.tab-panel{
  height: calc(65vh - 64px);
  overflow: scroll;
}
.tab-full-panel{
  height: calc(80vh - 64px);
  overflow: scroll;
}
.t-form__item{
  margin-bottom:6px
}

.t-row {
  margin-bottom: 14px;
}

.step-card {
  height: 100%;
  margin-bottom: 14px;
}
</style>
